<template>
  <l-layout class="l-tab-page">
    <l-panel style="padding-left: 0">
      <template #toolLeft>
        <div class="l-panel--item">
          <el-input
            :placeholder="$t('请输入关键字查询')"
            v-model="searchWord"
            @keyup.enter.native="hanleSearch"
            size="mini"
          >
            <el-button slot="append" icon="el-icon-search" @click="hanleSearch"></el-button>
          </el-input>
        </div>
      </template>
      <l-table
        :loading="tableLoading"
        :columns="lr_getPageColumns(columns)"
        :dataSource="tableShowData"
        row-key="f_Id"
        :isPage="true"
        :pageTotal="tableTotal"
        :tablePage.sync="tableCurrentPage"
        @loadPageData="turnTablePage"
      >
        <!--
                <template v-slot:f_TenantType="scope" >
                    {{scope.row.f_TenantType==0 ?"普通租户":"系统平台租户"}}
                </template>
            	-->
        <l-table-btns :btns="tableBtns" @click="lr_handleTableBtnClick"></l-table-btns>
      </l-table>
    </l-panel>
  </l-layout>
</template>

<script>
const api = window.$api.data.dataInterface;
//console.log(api);
export default {
  data() {
    return {
      ajaxTabIndex: 0,
      lr_isPage: true,
      // 表格
      columns: [
        { label: "数据名称", prop: "dataTypeFullName", minWidth: "120" },
        { label: "数据类型", prop: "dataTypeName", minWidth: "120" },
      ],
      tableBtns: [{ prop: "Edit", label: "选择" }],
      tableLoading: false,
      searchWord: "",
      tableShowData: [],
      tableData: [],

      formData: {},
      rules: {
        f_Name: [{ required: true, message: "请输入名称" }],
      },

      //分页
      tableTotal: 0,
      tablePageSize: 50,
      tableCurrentPage: 1,
      keyWord: "",
    };
  },
  computed: {},
  created() {
    this.loadTablePageData();
  },
  methods: {
    resetForm() {
      //this.formData.f_Id = '';
      this.$refs.form && this.$refs.form.resetFields();
    },
    // 校验表单
    validateForm() {
      return this.$formValidateWraper(this.$refs.form);
    },
    setForm(data) {
      // console.log("设置表单：");
      // console.log(data);
      this.formData = this.$deepClone(data);
    },
    getForm() {
      // console.log("获取表单：");
      let formData = this.$deepClone(this.formData);
      return formData;
    },

    loadTablePageData(isNotFirst) {
      if (isNotFirst) {
        this.tableCurrentPage = 1;
        this.searchWord = "";
        this.tableData = [];
      }
      this.tableLoading = true;
      let queryData = {
        rows: this.tablePageSize,
        page: this.tableCurrentPage,
        keyword: this.searchWord,
        f_CategoryId: this.f_CategoryId,
        f_EnabledMark: 1,
      };
      //console.log(api);
      api
        .getEntityList(queryData)
        .then((res) => {
          const data = this.$deepClone(res.data.data);
          this.tableData = data.rows;
          this.tableTotal = data.records;
          this.tableShowData = this.tableData;
          this.tableLoading = false;
        })
        .catch(() => {
          this.tableData = [];
          this.tableLoading = false;
        });
    },

    turnTablePage({ rows }) {
      this.tablePageSize = rows;
      this.loadTablePageData(true);
    },

    hanleSearch() {
      this.loadTablePageData();
    },

    lr_handleTableBtnClick(e) {
      //console.log(e);
      this.$emit("childEntityForm", e);
    },
  },
};
</script>
<style scoped>
.l-from-el-alert {
  margin-bottom: 20px;
}
.el-table .el-table__cell {
  padding: 2px 0;
}
</style>
